// 这个模块是axios配置的模块
import { Loading, Message } from 'element-ui'
import axios from 'axios'
import router from '@/router'
import store from '@/store'
// axios.defaults.baseURL = 'http://www.liulongbin.top:3008' 全局统一默认配置
// 自定义创建一个新的axios实例配置
const instance = axios.create({
  baseURL: 'http://www.liulongbin.top:3008'
})
let loadingService = null
// 两个拦截器中都有两个函数, 函数一是正确的请求和响应会触发,函数二是失败的请求和响应会触发
// 请求拦截器
instance.interceptors.request.use(function (config) {
  // 只要发送请求就会经过请求拦截器
  // config就是发送请求的配置信息对象
  // config中有一个headers节点,就是请求头信息, 可以在这个headers中配置token挂载
  // console.log(config)
  // config中有一个url, 表示的是当前发出的请求的地址 '/my/xxx' '/api/xxx'
  console.log('你在发送请求', config)
  if (config.url.startsWith('/my')) {
    config.headers.Authorization = localStorage.getItem('tokenKey')
  }
  // 全屏loading开启
  // console.log(this)
  loadingService = Loading.service({
    lock: true, // 加载中锁定屏幕滚动
    text: '努力加载中...', // 文本提示
    spinner: 'el-icon-loading', // 加载字体图标
    background: 'rgba(0, 0, 0, 0.7)' // 遮罩半透明
  })
  return config
}, function (error) {
  // Do something with request error
  return Promise.reject(error)
})

// 响应拦截器
instance.interceptors.response.use(function (response) {
  // 只要服务器给浏览器响应数据经过响应拦截器
  // response就是响应的信息
  console.log('服务器将数据返回了', response)
  // 关闭全屏loading
  loadingService.close()
  return response
}, function (error) {
  console.dir(error) // 响应的错误对象, 这个响应对象中有一个response
  // 如果响应的状态码是401 token异常
  if (error.response.status === 401 && error.response.data.code === 1) {
    // 1. 清除本地存储token
    localStorage.removeItem('tokenKey')
    // 2. 重新登录
    router.push('/login')
    // 3. 清除个人信息 - 可选优化点
    store.commit('user/setUserInfo', {})
  }
  // console.log('响应失败了')
  Message.error('异常错误,请稍后重试')
  loadingService.close()
  // Do something with response error
  return Promise.reject(error)
})
export default instance
